/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
//Ext.onReady(viewtopiclist);
var storeTopicList;
var cmTopicList;
var gridTopicList;

function viewtopiclist(classId,className)
{
    if(storeTopicList==null)
    {
        storeTopicList = new Ext.data.Store({
            // load using script tags for cross domain, if the data in on the same domain as
            // this page, an HttpProxy would be better
            proxy: new Ext.data.HttpProxy({
                url: 'topicListData.jsp'
            }),

            // create reader that reads the Topic records
            reader: new Ext.data.JsonReader({
                root: 'root',
                totalProperty: 'totalCount',
                id: 'threadid',
                fields: [
                    {name: 'title'},
                    {name: 'userName'},
                    {name: 'shortUpdateTime'},
                    {name: 'id'},
                    {name: 'uid'},
                    {name: 'repliedCount'}
                ]
            })
            // turn on remote sorting
            //remoteSort: true
        });
    }
    // pluggable renders
    function renderUser(value, p, record)
    {
        return String.format('<table style="height:25px"><tr><td><div style="height:25px"><div style="height:3px"></div><a href="#" onclick=showUserInfo({2},"{3}") onmouseover="showSimpleViewOfUser({1})" onmouseout="hideSimpleViewOfUser()"><font size="3">{0}</font></a><div style="height:3px"></div></div></td></tr></table>',value,record.data.uid,record.data.uid,record.data.userName);
    }
    function renderTime(value, p, record)
    {
        return String.format('<table style="height:10px;"><tr><td valign="center">{0}</td></tr></table>',value);
    }
    function renderReply(value, p, record)
    {
        return String.format('<table style="height:10px;"><tr><td valign="center">{0}</td></tr></table>',value);
    }
    function renderTitle(value, p, record)
    {
        return String.format('<table style="height:5px;"><tr><td valign="center"><div style="height:9px"></div><font size="3"><a href="#" onclick="viewTopicDetail({1},1);">{0}</a></font></td></tr></table>',value,record.data.id);
    }

    // the column model has information about grid columns
    // dataIndex maps the column to the specific data field in
    // the data store
    if(cmTopicList==null)
    {
        cmTopicList = new Ext.grid.ColumnModel([{
           //id: 'topic', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
           header: "主题",
           dataIndex: 'title',
           width: 270,
           renderer: renderTitle
        },{
           header: "发帖人",
           dataIndex: 'userName',
           width: 70,
           align: 'center',
           renderer: renderUser
        },{
           header: "更新时间",
           dataIndex: 'shortUpdateTime',
           width: 80,
           align: 'right',
           renderer:renderTime
        },{
           //id: 'last',
           header: "回复/阅读",
           dataIndex: 'repliedCount',
           width: 50,
           align: 'center',
           renderer:renderReply
        }]);
        cmTopicList.defaultSortable = true;
    }

    if(gridTopicList==null)
    {
        gridTopicList = new Ext.grid.GridPanel({
            el:'divTopicList',
            store: storeTopicList,
            cm: cmTopicList,
            trackMouseOver:true,
            sm: new Ext.grid.RowSelectionModel({selectRow:Ext.emptyFn}),
            loadMask: true,
            iconCls:'icon-grid',
            //autoHeight: true,
            autoScroll: true,
            border: false,
            viewConfig: {
                forceFit:true,
                enableRowBody:true,
                showPreview:false,
                getRowClass : function(record, rowIndex, p, store){
                    if(this.showPreview){
                        p.body = '<p>'+record.data.title+'</p><br>';
                        return 'x-grid3-row-expanded';
                    }
                    return 'x-grid3-row-collapsed';
                }
            },
            tbar:[
                {},
                '<a href="#"><div id="topicListTitleId">'+className+'</div></a>',
                {}
            ],
            bbar: new Ext.PagingToolbar({
                pageSize: 25,
                store: storeTopicList,
                displayInfo: true,
                displayMsg: '显示的主题 {0} - {1} of {2}',
                emptyMsg: "暂无帖子"/*,
                items:[
                    '-', {
                    pressed: true,
                    enableToggle:true,
                    text: ' 展开 ',
                    cls: 'x-btn-text-icon details',
                    toggleHandler: toggleDetails
                }]*/
            })
        });
    }
    
    gridTopicList.render();
    storeTopicList.on('beforeload',function(){
        Ext.apply(
        this.baseParams,
        {
            classifyId:classId
        });
    });
    storeTopicList.load({params:{start:0, limit:25,classifyId:classId}});
    tabCount++;
    var panSearch = new Ext.Panel({
        id:'tabTopicList',
        //html:document.getElementById('divViewTopic').innerHTML,
        title: '板块查看',
        //closable:true,
        autoScroll:true,
        //items:[divSearchResult]
        el : divTopicList
    });
    panel.insert(1,panSearch);
    panel.activate('tabTopicList');
    //panel.getActiveTab().setTitle(className);
    document.getElementById('topicListTitleId').innerHTML=className;
}
    
var storeClassList;
var cmClassList;
var gridClassList;

function templateModuleGrid()
{
    storeClassList = new Ext.data.Store({
        // load using script tags for cross domain, if the data in on the same domain as
        // this page, an HttpProxy would be better
        proxy: new Ext.data.HttpProxy({
            url: 'catalogData.jsp'
        }),
        
        // create reader that reads the Topic records
        reader: new Ext.data.JsonReader({
            root: 'root',
            totalProperty: 'totalCount',
            id: 'threadid',
            fields: [
                {name: 'head'},
                {name: 'name'},
                {name: 'id'},
                {name: 'des'},
                {name: 'count'},
                {name: 'owners'}
            ]
        })
    });

    function renderDes(value, p, record){
        return String.format('<table align="center" cellspacing="5px"><tr><td  height="35"><br><font size=5><a href="#" onclick=viewtopiclist({2},"{3}")>{0}</a></font><br></td></tr><tr><td>{1}</td></tr></table>',value, record.data.des,record.data.id,value);
    }
    function renderCount(value, p, record){
        return String.format(
                '<table valign="center" cellspacing="5px"><tr><td  height="35"><br><font size=3>{0}</font><br></td></tr></table>',
                value);
    }
    function renderLast(value, p, r){
        return String.format('{0}<br/> {1}', value, r.data['des']);
    }

    // the column model has information about grid columns
    // dataIndex maps the column to the specific data field in
    // the data store
    cmClassList = new Ext.grid.ColumnModel([{
           //id: 'topic', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
           header: "",
           dataIndex: 'head',
           width: 50
          // renderer: renderTopic
        },{
           header: "版块名称",
           dataIndex: 'name',
           width: 100,
           align: 'center',
           //hidden: true
           renderer: renderDes
        },{
           header: "主题数",
           dataIndex: 'count',
           width: 20,
           align: 'center',
           renderer: renderCount
           //hidden: true
        },{
           header: "斑竹",
           dataIndex: 'owners',
           width: 50,
           align: 'center'
           //hidden: true
        }]);

    // by default columns are sortable
    cmClassList.defaultSortable = true;

    gridClassList = new Ext.grid.GridPanel({
        el:'divClasses',
        //width:600,
        //height:380,
        //title:'gridview',
        store: storeClassList,
        cm: cmClassList,
        trackMouseOver:true,
        sm: new Ext.grid.RowSelectionModel({selectRow:Ext.emptyFn}),
        loadMask: true,
        viewConfig: {
            forceFit:true,
            enableRowBody:true,
            showPreview:false,
            height:'100%',
            getRowClass : function(record, rowIndex, p, store){
                if(this.showPreview){
                    p.body = '<p>'+record.data.name+'</p><br>';
                    return 'x-grid3-row-expanded';
                }
                return 'x-grid3-row-collapsed';
            }
        }
    });
}

//此函数已被放弃
function viewtopiclistNE(classId,className){
    document.getElementById("divData2").style.display='none';
    document.getElementById("divWelcome").style.display='none';
    document.getElementById("divData").style.display='';
    gridTopicList.setHeight(document.getElementById("divData").clientHeight);//document.getElementById("divData").style
    //alert(document.getElementById("divData").clientHeight);
    gridTopicList.render();
    // trigger the data store load
    storeTopicList.load({params:{start:0, limit:25,classifyId:classId}});
    
    panel.getItem("welcomeTab").setTitle("版块:"+className);
    panel.setActiveTab(0);//activeTab = 0;
    panel.render();
}

function viewClassifies()
{
    //document.getElementById("divData").style.display='none';
    document.getElementById("divWelcome").style.display='none';
    document.getElementById("divClasses").style.display='';
    gridClassList.setHeight(document.getElementById("divClasses").clientHeight);
    gridClassList.render();
    // trigger the data store load
    storeClassList.load({params:{page:0, limit:25}});
    
    panel.getItem("welcomeTab").setTitle("所有分类");
    panel.setActiveTab(0);
    panel.render();
}

function toggleDetails(btn, pressed){
    var view = gridTopicList.getView();
    view.showPreview = pressed;
    view.refresh();
}